<template>
  <div class="moreComment">
    <TopBars msg="更多跟帖" />

    <div class="goodComments_content" v-if="commentList">
      <Comment :commentData="comment" v-for="(comment,index) in commentList" :key="index" />
    </div>

    <div class="goodComments_content" v-if="commentList.length===0">
      <div class="noPicBox">
        <img src="@/assets/noPic.jpg" alt class="noPic" />
      </div>
    </div>
  </div>
</template>

<script>
import TopBars from "@/components/TopBars";
import Comment from "@/components/comment";

export default {
  components: {
    TopBars,
    Comment
  },

  data() {
    return {
      commentList: ""
    };
  },

  created() {
    this.getComment();
  },

  methods: {
    getComment() {
      this.$axios({
        url: "/post_comment/" + this.$route.params.id
      }).then(res => {
        console.log("更多评论列表返回结果", res.data.data);

        this.commentList = res.data.data;
      });
    }
  }
};
</script>

<style lang="less" scoped>
.moreComment {
    
  .goodComments_content {

    .noPicBox {
      display: flex;
      align-items: center;
      justify-content: center;

      .noPic {
        width: 38.889vw;
      }
    }
  }
}
</style>